<template>
	<view id="infoSearch">
		<!-- 检测信息追踪 -->
		<view class="nav-box">
			<view class="nav-box-text">
				<image src="@/static/img/home/person.png" class="person"></image>
				<view class="welcome">
					<view><text>姓名：{{ userInfo.nickName }}</text></view>
					<view><text>单位：{{ userInfo.dept.deptName }}</text></view>
				</view>
			</view>
		</view>
		<view class="uni-list">
			<uni-forms ref="form" label-width="120" :modelValue="form" :rules="rules">
				<view v-for="(item, index) in form.formFillValues" >
					<uni-forms-item 
						:label="item.name" 
						:name="item.code"
					>
						<uni-easyinput 
							v-model="item.value" 
							:inputBorder="false" 
							:maxlength="100"
							placeholder="请输入" 
							v-if="item.inputType == 'INPUT'"
						/>
						<ccPicker 
							v-model="item.value"
							:range="item.options" 
							k="value" 
							v="key" 
							class="picker"
							v-if="item.inputType == 'SELECT'"
						></ccPicker>
						<uni-easyinput
							v-model="item.value" 
							:inputBorder="false" 
							style="display: none;"
							v-if="item.inputType == 'SELECT'"
						/>
						<uni-datetime-picker 
							type="date" 
							v-model="item.value" 
							:border="false"
							v-if="item.inputType == 'DATE'"
						/>
					</uni-forms-item>
					<uni-forms-item
						:label="`原${item.name}`" 
						:name="item.code"
					>
						<uni-easyinput
							v-model="oldFillValues[index].value" 
							:inputBorder="false" 
							disabled
							placeholder="" 
						/>
					</uni-forms-item>
				</view>
			</uni-forms>
		</view>
		<view style="height: 60px;"></view>
		<view class="bottom-nav">
			<button type="primary" :loading="loading" class="btn" @click="save()">修改</button>
		</view>
	</view>
</template>

<script>
	import ccPicker from "@/components/cc-picker/cc-picker.vue"
	import { getSampleFormField , saveSampleFormField } from '@/api/sampleCheck/index'
	import { decrypt } from '@/common/jsencrpty.js';
	export default {
		data() {
			return {
				form:{},
				rules: {
				},
				oldFillValues:null,
				loading:false
			};
		},
		components: { ccPicker },
		onLoad(params) {
			this.userInfo = uni.getStorageSync('userInfo');
			this.userInfo.nickName = decrypt(this.userInfo.nickName);
			this.projectInfo = uni.getStorageSync('projectInfo');
			this.getSampleFormField(params.qrCode)
		},
		methods:{
			getSampleFormField(qrCode){
				getSampleFormField(qrCode).then(res=>{
					this.form = res.data
					this.oldFillValues = JSON.parse(JSON.stringify(res.data.formFillValues))
					// console.log(res,'qrCode',this.form.formFillValues,1111)
				})
			},
			save(){
				this.loading = true
				uni.showLoading({
					mask: true,
					title: '修改中...'
				})
				saveSampleFormField(this.form).then(res=>{
					this.loading = false
					uni.hideLoading()
					uni.showToast({
						title: res.msg,
						success:()=>{
							setTimeout(()=>{
								uni.navigateBack();
							},1000)
						}
					})
					
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	#infoSearch {
		overflow: hidden;
		min-height: 100vh;
		background-color: #fafafa;
		.nav-box {
			width: 100vw;
			height: 160px;
			margin-top: -44px;
			padding: 56px 20px 56px 20px;
			background-image: url('../../static/img/home/head-bg.png');
		
			.nav-box-text {
				height: 50px;
				display: flex;
				align-items: center;
		
				.person {
					width: 48px;
					height: 48px;
				}
				.welcome {
					color: #333;
					font-size: 32rpx;
					margin-left: 40rpx;
				}
			}
		}
		.uni-list {
			background-color: #fff;
			margin: -30px 20px 0 20px;
			box-shadow: 0px 0px 5px 1px rgba(0, 0, 0, .1);
			
			/deep/ .uni-forms-item {
				padding: 0 10px;
				border-bottom: 1rpx solid #bfbfbf;
			}
			/deep/ .uni-forms-item__inner {
				padding: 0 10px;
				// border-bottom: 1rpx solid #bfbfbf;
			}
			/deep/ .uni-error-message {
				right: 0;
				left: auto;
				margin-right: 5px;
			}
			/deep/ .uni-date__x-input {
				height: 36px;
				line-height: 36px;
			}
			/deep/ .uni-group {
				margin-top: 0 !important;
			}
			/deep/ .uni-input {
				display: flex;
				font-size: 14px;
				min-height: 36px;
				padding-left: 12px;
				align-items: center;
			}
			.picker {
				height: 36px;
				line-height: 36px;
				padding-left: 10px;
				
				/deep/ uni-view {
					height: 36px;
					line-height: 36px;
				}
			}
			.uni-forms-item {
				
				&:last-child {
					/deep/ .uni-forms-item__inner {
						border-bottom: 0;
					}
				}
			}
		}
		.bottom-nav {
			left: 0;
			bottom: 0;
			width: 100vw;
			height: 50px;
			padding: 10px;
			position: fixed;
			background-color: #fff;
			box-shadow: 0px 0px 5px 1px rgba(0, 0, 0, .1);
		}
	}
</style>
